<template>
	<view class="page">
		<view class="topVue">
			<view class="safeVue" :style="{ height: statusBarHeight + 'rpx' }"></view>
			<view class="flex align-center padding-row30" :style="{ height: barHeight + 'rpx', top: statusBarHeight + 'rpx' }" @click="$tools.back()">
				<image src="../../static/back.png" style="width: 48rpx; height: 48rpx;"></image>
				<text style="line-height: 1; color: #454545; font-weight: 600; font-size: 32rpx; padding-left: 20rpx;">登录</text>
			</view>
		</view>
		<view :style="{ height: statusBarHeight + barHeight + 'rpx' }"></view>
		<view class="logo">
			<image src="https://jg.zgxingongxiang.com/test/static/WeChat/6.jpg" style="width: 150rpx; height: 150rpx; border-radius: 20rpx;"></image>
			<u-gap height="20"></u-gap>
			<text style="line-height: 1; color: #454545; font-weight: 600;">智养苑</text>
		</view>
		
		<!-- <view class="oneClick margin50" @click="getCode">一键登录</view> -->
		
		<button class="oneClick margin50"  open-type="getPhoneNumber" @getphonenumber="decryptPhoneNumber">
			本机号码一键登录
		</button>
		
		<view class="botVue flex-center align-center" style="background: transparent;">
			<u-checkbox v-model="checked" active-color="#D37430"></u-checkbox>
			我已阅读并同意
			<text @click="$tools.route('../mine/agreement')">《服务条款》</text> 和 <text @click="$tools.route('../mine/privacy')">《隐私政策》</text>
		</view>		
	</view>
</template>

<script>
	export default {
		data(){
			return {
				statusBarHeight: 0,
				barHeight: 0,
				checked: false
			}
		},
		onLoad() {
			let that = this;
			wx.getSystemInfo({
				success(res) {
					let deviceWidth = wx.getSystemInfoSync().windowWidth
					that.statusBarHeight = Number(res.statusBarHeight) * ( 750 / deviceWidth ) 
					let menuButtonInfo = wx.getMenuButtonBoundingClientRect()
					let barHeight = menuButtonInfo.height + (menuButtonInfo.top - res.statusBarHeight) * 2
					that.barHeight = Number(barHeight) * ( 750 / deviceWidth )
				},
			});
		},
		
		methods: {
			decryptPhoneNumber(e){
				console.log(e.detail)
				if(e.detail.code) {
					if(!this.checked) return this.$u.toast("请阅读并同意用户协议与服务条款")
					this.getPhoneNumber(e.detail.code)
				}
				if(e.detail.errMsg==="getPhoneNumber:fail user deny") return this.$u.toast("用户拒绝授权")
			},
			// 获取手机号
			getPhoneNumber(code){
				uni.showLoading()
				this.$request(`/api/WeChat/getWeChatPhone?code=${code}`, {}, "GET").then(res=>{
					console.log(res)
					if(res.code===200) {
						console.log("获取手机号成功")
						this.loginFun(res.data)
					}else{
						console.log(res)
						uni.hideLoading()
						this.$u.toast(res.msg);
					}
				})
			},
			
			// 登录
			loginFun(phone){
				this.$request(`/api/WeChat/loginOrRegist?phoneNo=${phone}`, {}, "POST").then(res=>{
					if(res.code===200) {
						uni.hideLoading()
						this.$u.toast("登录成功")
						uni.setStorageSync("token", res.data.token)
						this.$store.dispatch("setUser", res.data)
						this.$store.state.isLogin = true
						setTimeout(() => {
							// uni.$emit("isReferrerId", res.data.referrerId)
							this.$store.dispatch("getCurrent", 0)
							uni.switchTab({
								url: "../index/index"
							})
						}, 1000)
					}else{
						uni.hideLoading()
						this.$u.toast(res.msg);
					}
				})
			}
		}
	}
</script>

<style lang="less" scoped>
	.h4 {
		color: #333;
		font-weight: 600;
	}
	.topVue {
		width: 100%;
		background: #fff;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 99;
		.safeVue {
			width: 100%;
		}
	}
	.logo {
		width: 100%;
		padding-top: 200rpx;
		text-align: center;
	}
	.oneClick {
		width: 670rpx;
		height: 88rpx;
		background: #D37430;
		border-radius: 44rpx;
		line-height: 88rpx;
		color: #fff;
		text-align: center;
		font-weight: 600;
	}
	.botVue {
		width: 100%;
		height: 120rpx;
		background: #fff;
		position: fixed;
		left: 0;
		bottom: 0;
		text {
			color: #D37430;
			line-height: 1;
		}
	}
</style>
